<template>
  <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pager.pageNum"
      :page-sizes="pager.options" :page-size="pager.pageSize" layout="total, prev, pager, next, jumper, sizes"
      :total="pager.count">
    </el-pagination>
</template>

<script>
export default {
  name: 'pagination',
  props:['pager'],
  data() {
    return {
    };
  },
  methods: {
     handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
        this.pager.pageSize = val;
        this.$parent.getList();
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.pager.pageNum = val;
         this.$parent.getList();
      },
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped></style>
